<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>编辑地址</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="__PUBLIC__/Product/css/page_bianjidizhi.css">
    <link rel="stylesheet" href="__PUBLIC__/Product/css/lib/animate.css">
    <script src="__PUBLIC__/Product/js/lib/flexible.js"></script>
</head>
<body style="background-color: #f4f4f4;">
    <div class="edit_address_box">
        <!-- 头部 -->
        <div class="edit_address_header">
        	 <p><img src="__PUBLIC__/Product/img/fanhui.png" onclick="window.location.href =  document.referrer" /></p>
            <p>编辑地址</p>
            <p>保存</p>
        </div>
        <!-- 内容 -->
        <div class="edit_address_content">
        	<ul>
        		<li>
        			<label for="">收货人</label>
        			<input type="hidden" value=""  id="name_id"/>
        			<input type="text" class="name" />
        		</li>
        		<li>
        			<label for="">手机号</label>
        			<input type="number" id="telphone" maxlength="11" />
        		</li>
        		<li>
        			<label for="">地区</label>
        			<input type="text" class="county" />
        		</li>
        		<li>
        			<label for="">街道</label>
        			<input type="text" class="street" />
        		</li>
        		<li>
        			<label for="">详细地址</label>
    				<textarea name="" rows="5" cols="30" class="detail"></textarea>
        		</li>
        		<li>
        			<span>设为默认地址</span>
        			<input type="checkbox" class="check" />
        		</li>
        	</ul>
        </div>
    </div>
</body>
</html>
<script src="__PUBLIC__/Product/js/lib/jquery3.2.1.js"></script>
<script>
	$(document).ready(function() {
		//获取页面上的所有元素，并组成一个对象
		var obj = {
			id: $("#name_id"),
			name: $('.name'),
			tel: $('#telphone'),
			Province: $('.county'),
			City: $('.street'),
			Area: $('.detail'),
		}
		//如果有缓存，要进行赋值
		if(localStorage.getItem('data')) {
			var adressData = JSON.parse(localStorage.getItem('data'));
			console.log(adressData);
			obj.name.val(adressData.name);
			obj.id.val(adressData.id);
			obj.tel.val(adressData.tel);
			obj.Province.val(adressData.sheng);
			obj.City.val(adressData.shi);
			obj.Area.val(adressData.qu);
			if(adressData.state == 1) {
				$(".check").prop("checked", true);
			} else if(adressData.state == 2) {
				$(".check").prop("checked", false);
			}
		}
		//点击保存按钮，获取页面上的内容并存到缓存中
		$(".edit_address_header p:nth-child(3)").bind("click", function() {
			var name = $(".name").val();
			var telphone = document.getElementById("telphone").value;
			var area = $(".county").val();
			var address = $(".detail").val();
			var street = $(".street").val();
			var zip_code = $(".zip_code").val();
			var id = $("#name_id").val();
			var state;
			if($(".check").prop("checked") == true) {
				state = 1;
			} else if($(".check").prop("checked") == false){
				state = 2;
			}
			console.log(state);
			//			判断输入框的内容是否为空
			var myreg = /^1[3|4|5|7|8][0-9]\d{4,8}$/;
			if(name == "") {
				console.log("姓名不能为空!");
			} else if(telphone == '') {
				console.log("电话不能为空!");
			} else if(telphone.length != 11) {
				console.log("请输入有效的手机号");
			} else if(!myreg.test(telphone)) {
				console.log("请输入有效的手机号!");
			} else if(area == "") {
				console.log("请输入地区名称");
			} else if(street == "") {
				console.log("请输入街道名称");
			} else if(zip_code == "") {
				console.log("请输入邮编");
			} else if(address == "") {
				console.log("请输入详细地址");
			} else {
				$.ajax({
					type: "post",
					url: "http://a.91jfk.com/Product/Address/edit_address",
					data: {
						id: id,
						name:name,
						tel:telphone,
						area:area,
						street:street,
						address:address,
						state:state,
					},
					datatype: "json",
					success: function(xhr) {
						if(xhr.code == "1"){
							
						} else {
							window.location.href="adress_list.html";
						}
					}
				})
			}
		});
	});
</script>


